<template>
    <div>
        <div class="sangter">
        <h2>实时拥堵指数</h2>
        <div class="yanter"></div>
        <h2>1.38</h2>
        <p>当前实时拥堵指数</p>
        <p>较上周上涨了 45%</p>
        </div>
        <span>近30天最拥堵的一天是2021-10-2</span>
    </div>
</template>

<script>
export default {
    
};
</script>

<style lang="less" scoped>
.sangter{
    height: 220px;
    border-bottom: 2px solid gray;
}
span{
    padding-left: 110px;
}
p{
   padding-left: 150px;
}
.yanter{
    margin: 0 auto;
    margin-top: 20px;
    width: 350px;
    height: 30px;
    background: linear-gradient(45deg, #00FF00 17%,#DDFF05 44%,#FF0000 83%);
}
</style>